<template>
	<view class="diamond-wrapper" :class="userInfo.is_svip ? 'is_svip' : ''">
		<view class="diamond-inner">
			<u-grid :border="false" col="3">
				<u-grid-item v-for="(listItem,listIndex) in list" :key="listIndex">
					<view class="grid-item" @click="handleCilck(listItem)">
						<u-image :src="listItem.img" width="50px" height="50px" shape="circle"></u-image>
						<view class="grid-text">{{listItem.title}}</view>
					</view>
				</u-grid-item>
			</u-grid>
		</view>
    <u-modal v-model="showWechat" confirm-text="保存图片" :show-cancel-button="false" @confirm="downLoadWechatQr" confirm-color="#FF6A60" :mask-close-able="true">
      <view class="wechat-content">
        <u-image src="https://avatar-1302621554.cos.ap-nanjing.myqcloud.com/wechat.png" width="150px" height="150px"></u-image>
        <view class="ui-TC-Main tip">保存图片添加入群</view>
      </view>
    </u-modal>
	</view>
</template>

<script>
  const isAndroid = vk.myfn.HmUtils.isAndroid
	export default {
    props: {
      userInfo: {
        type: Object,
        default: () => {}
      }
    },
		data() {
			return {
        showWechat: false,
				list: [{
						img: '/static/creator/star.png',
						title: '我的模板',
            path: '/pages/creator/my-template'
					},
					{
						img: '/static/creator/order.png',
						title: '订单',
            path: '/pages/order/order'
					},
					// {
					// 	img: '/static/creator/team.png',
					// 	title: '团队'
					// },
					{
						img: '/static/creator/more.png',
						title: '加入群聊',
            type: 'wechat'
					}
				],
			}
		},
		methods: {
			handleCilck(item) {
				if (item.path) {
          vk.navigateTo(item.path)
        } else if (item.type === 'wechat') {
          this.showWechat = true
        }
			},
      downLoadWechatQr() {
        uni.downloadFile({
          url: 'https://avatar-1302621554.cos.ap-nanjing.myqcloud.com/wechat.png',
          success: function(res) {
            if (res.statusCode === 200) {
              uni.saveImageToPhotosAlbum({
                filePath: res.tempFilePath,
                success: function() {
                  uni.showToast({
                    title: '保存成功'
                  })
                },
                fail: function(error) {
                  uni.showToast({
                    title: '保存失败：' + error.errMsg
                  })
                }
              })
            } else {
              uni.showToast({
                title: '下载失败：' + res.statusCode
              })
            }
          },
          fail: function(error) {
            uni.showToast({
              title: '下载失败：' + error.errMsg
            })
          }
        })
      }
		}
	}
</script>

<style lang="scss">
	.diamond-wrapper {
		padding: 0 30rpx;
		margin-top: 38rpx;
    &.is_svip {
      margin-top: 76rpx;
    }
		.diamond-inner {
			width: 100%;
			background: #fff;
			border-radius: 16rpx;
			box-shadow: 0px 8.5px 25.5px  rgba(233, 239, 245, 1);
			
			.grid-item {
				.grid-text {
					text-align: center;
					font-size: 26rpx;
					color: rgba(111, 114, 120, 1);
					margin-top: 18rpx;
				}
			}
			
		}
		
    .wechat-content {
      padding-top: 30rpx;
      text-align: center;
      display: flex;
      align-items: center;
      flex-direction: column;
      
      .tip {
        font-size: 24rpx;
        margin-top: 20rpx;
        color: #8e8e8e;
      }
    }
	}
</style>